<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/vue.min.js"></script>
	</head>
<body>
  <div id="app">
    <login></login> <!--子组件-->
  </div>

  <script>
    var login = {
      template: '<h1>{{childMsg}}</h1>',
      data(){
        return {
          childMsg:'child'
        }
      },  
      created: function () {
        alert("子组件的created")
      },
     
      mounted: function () {
        alert("子组件的mounted")
      }
    }

    var vm = new Vue({
      el: '#app',
      data: {
        fatherMsg: "father"
      },
      methods: {},
      components: {
        login
      },
      created: function () {
        alert("父组件的created")
      },
      mounted: function () {
        alert("父组件的mounted")
      },
    });
  </script>
</body>

</html>